<div class="ui-grid-row ui-widget-content" style="height: calc(100% - 30px)">
    <div class="ui-g" style="height: 300px;">
        <p-table #dt [columns]="cols" [value]="parts" selectionMode="single" (onRowSelect)="onRowSelect($event)"
            (onRowUnselect)="onRowUnselect($event)" [(selection)]="selectedPart" [scrollable]="true"
            scrollHeight="200px">
            <ng-template pTemplate="caption">
                <div style="text-align: right">
                    <i class="fa fa-search" style="margin:4px 4px 0 0"></i>
                    <input type="text" pInputText size="20" placeholder="参与者过滤"
                        (input)="dt.filterGlobal($event.target.value, 'contains')" style="width:auto">
                </div>
            </ng-template>
            <ng-template pTemplate="header" let-columns>
                <tr>
                    <th *ngFor="let col of columns" [ngStyle]="col.style">
                        {{col.header}}
                    </th>
                </tr>
            </ng-template>
            <ng-template pTemplate="body" let-rowData let-columns="columns">
                <tr [pSelectableRow]="rowData">
                    <td *ngFor="let col of columns" [ngSwitch]="col.field" [ngStyle]="col.style">
                        <ng-container *ngSwitchCase="'filter'">
                            <ng-container *ngIf="rowData[col.field]"><i class="pi pi-check"
                                    style="color:rgb(3,169,244);"></i></ng-container>
                        </ng-container>
                        <ng-container *ngSwitchDefault>{{rowData[col.field]}}</ng-container>
                    </td>
                </tr>
            </ng-template>
        </p-table>
    </div>
    <hr>
    <div class="ui-g" style="height: 50px;">
        <div class="ui-g-12">
            <textarea [(ngModel)]="filterSql" rows="5" style="width:100%" pInputTextarea></textarea>
        </div>
    </div>
</div>
<div class="ui-grid-row">
    <div class="button-item">
        <button pButton type="text" class="ui-button-danger" icon="fa fa-times" label="关闭" (click)="cancel()"></button>
        <button pButton type="text" *ngIf="selectedPart && selectedPart.filter" class="ui-button-warning"
            icon="fa fa-trash" label="移除过滤" (click)="removeFilter()"></button>
        <button pButton type="text" class="ui-button-info" icon="fa fa-save" label="保存" (click)="save()"></button>
    </div>
</div>